<template>
  <div v-show="list.length > 0">已完成{{ finish }}/全部{{ list.length }}</div>
  <div>
    <button @click="clear" v-show="finish > 0">删除已完成</button>
  </div>
</template>

<script lang="ts" setup>
import { ref, computed } from "vue";
const props = defineProps({
  list: {
    type: Array,
  },
});
const emit = defineEmits(["clear"]);
const finish = computed(() => {
  let arr = props.list?.filter((item: any) => {
    return item.check;
  });
  return arr?.length;
});

const clear = () => {
  let arr = props.list?.filter((item: any) => {
    return item.check === false;
  });
  emit("clear", arr);
};
</script>

<style></style>
